<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="renderer" content="webkit|ie-comp|ie-stand">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <title>会话记录</title>
  <script src="../../../static/kaige/js/szload.js"></script>
</head>

<body>
  <div class="kaige-body layui-form pagelist">
    <table class="layui-table" id="pageTable" lay-filter="pageTable" lay-size="sm"></table>
    <input type="hidden" name="keywordsCache" value="{}" />
  </div>
  <script>
    load_init_js(function () {
      layui.config({
        base: szoapcpath + '/static/kaige/layuiextend/'
      }).use(['element', 'table', 'form', 'layer', 'kaige', 'laytpl'], function () {
        var element = layui.element,
          layer = layui.layer,
          table = layui.table,
          form = layui.form,
          kaige = layui.kaige,
          dropdown = layui.dropdown,
          util = layui.util,
          $ = layui.$,
          laytpl = layui.laytpl;
        form.render();

        //查看图片
        window.viewImage = function (imgUrl) { kaige.viewimage({ maxwidth: 600, maxheight: 600, url: imgUrl }); }

        kaige.table({
          elem: '#pageTable',
          url: "/im.chat/chatloglist",
          id: 'pageTable',
          toolbar: '#dtoolbar',
          cols: [[
            { type: 'checkbox' },
            { type: 'numbers', title: '序号' },
            { field: 'chat_type', width: 80, title: '类型', align: 'center', templet: function (d) { return typeTd(d) } },
            { field: 'is_send', width: 80, title: '状态', align: 'center', templet: function (d) { return sendTd(d) } },
            {
              field: 'send_id_name', title: '发送者', width: 150, templet: function (d) {
                return '<img src="' + d.send_id_avatar + '" class="chat_head" alt="" /> ' + d.send_id_name;
              }
            },
            {
              field: 'rece_id_name', title: '接收者', width: 150, templet: function (d) {
                if (d.chat_type == 1) {
                  return '<img src="' + d.rece_id_avatar + '" class="chat_head" alt="" /> ' + d.rece_id_name;
                } else if (d.chat_type == 2) {
                  return '<img src="' + d.group_id_avatar + '" class="chat_head" alt="" /> ' + d.group_id_name;
                }
              }
            },
            { field: 'content', title: '内容', align: 'center',hide:true },
            { field: 'create_time', width: 160, title: '时间', align: 'center' }
          ]],
          done: function (res, curr, count) {
            //给筛选表单赋值
            form.val("searchform", {
              "search_chat_type": getkeywords('search_chat_type')
            });
            form.render(null, 'searchform');
          }
        });

        //获取筛选表单
        function getsearchform() {
          var gfv = {
            "search_chat_type": getkeywords('search_chat_type')
          }
          gfv.rnd = Math.random();
          return gfv;
        }

        //执行重载表格
        function reload_sxtable() {
          var where = getsearchform();
          if (JSON.stringify(where) == "{}") {
            layer.msg('当前没有筛选条件！'); return;
          }
          setTimeout(function () {
            //执行重载
            table.reload('pageTable', {
              height: 'full-10'  //必须写，有时候高度不出来
              , page: { curr: 1 } //置第一页
              , where: where
            });
          }, 300);
        }

        //监听状态筛选
        form.on('select(search_chat_type)', function (data) {
          savekeywords('search_chat_type', data.value);
          reload_sxtable();
        })

        function typeTd(d) {
          switch (d.chat_type) {
            case 1:
              return '<span class="layui-badge layui-bg-green">私聊</span>';
              break;
            case 2:
              return '<span class="layui-badge layui-bg-black">群聊</span>';
              break;
          }
        }

        function sendTd(d) {
          switch (d.is_send) {
            case 1:
              return '<span class="layui-badge layui-bg-green">已发</span>';
              break;
            case 2:
              return '<span class="layui-badge layui-bg-black">离线</span>';
              break;
          }
        }

        //列表-监听表头工具栏事件dtoolbar
        table.on('toolbar(pageTable)', function (obj) {
          var checkStatus = table.checkStatus(obj.config.id);
          switch (obj.event) {
            case 'btn-delete':
              btn_del(checkStatus);
              break;
          }
        });

        //删除
        function btn_del(d) {
          kaige.del({
            url: "/im.chat/chatlogdel",
            data: d.data,
            tablelayid: 'pageTable',
          });
        }

      });
    });
  </script>
  <script type="text/html" id="dtoolbar">
    <div class="layui-form filter-form" lay-filter="searchform">
      <div class="layui-inline" style="width:120px;" >
        <select name="search_chat_type" lay-filter="search_chat_type">
            <option value="">类型</option>
            <option value="1">私聊</option>
            <option value="2">群聊</option>
        </select>
      </div>
      <div class="layui-btn-group">
        <button type="button" class="layui-btn layui-btn-sm" lay-event="btn-delete"><i class="layui-icon layui-icon-delete"></i> 删除</button>
      </div>
    </div>
  </script>

</body>

</html>